/**
 * 公共变量
 */
$root        =  "../../images/"
/**
 * 尺寸
 * ====
 */

/**
 * REM (Root em)
   ---
 * 浏览器字体的默认尺寸为 16px
 * 通常情况下，为方便计算将默认字体设为10px(10 / 16 = 0.625)
 * Chrome浏览器的默认最小字体为12px (12 / 16 = 0.75)
 * 如果 font-size 值为 62.5%, 在Chrome里 1rem = 12px， 其他浏览器为10px
 * 所以将字体设置为75%(即1rem = 12px)
 * 再通过12px,得出10px: (10 / 12)rem
 */


//rem 系数
$rem-ratio = 10 / 12 // 10 / 12

/**
 * 变量命名方式
 * s(表示size)  + 设计图纸像素值(px为单位) + rem
 */

$s1    = $rem-ratio * 0.1rem    //1px
$s2    = $rem-ratio * 0.2rem    //2px
$s3    = $rem-ratio * 0.3rem    //3px
$s5    = $rem-ratio * 0.5rem    //5px
$s10   = rem = $rem-ratio * 1.0rem    //10px

$s11   = $s10 * 1.1
$s12   = $s10 * 1.2
$s13   = $s10 * 1.3
$s14   = $s10 * 1.4
$s15   = $s10 * 1.5
$s16   = $s10 * 1.6
$s17   = $s10 * 1.7
$s18   = $s10 * 1.8
$s19   = $s10 * 1.9
$s20   = $s10 * 2.0
$s21   = $s10 * 2.1
$s22   = $s10 * 2.2
$s23   = $s10 * 2.3
$s24   = $s10 * 2.4
$s25   = $s10 * 2.5
$s26   = $s10 * 2.6
$s27   = $s10 * 2.7
$s28   = $s10 * 2.8
$s29   = $s10 * 2.9
$s30   = $s10 * 3.0
$s31   = $s10 * 3.1
$s32   = $s10 * 3.2
$s33   = $s10 * 3.3
$s34   = $s10 * 3.4
$s35   = $s10 * 3.5
$s36   = $s10 * 3.6
$s37   = $s10 * 3.7
$s38   = $s10 * 3.8
$s39   = $s10 * 3.9
$s40   = $s10 * 4.0
$s41   = $s10 * 4.1
$s42   = $s10 * 4.2
$s43   = $s10 * 4.3
$s44   = $s10 * 4.4
$s45   = $s10 * 4.5
$s46   = $s10 * 4.6
$s47   = $s10 * 4.7
$s48   = $s10 * 4.8
$s49   = $s10 * 4.9
$s50   = $s10 * 5.0


/**
 * %(屏幕宽度)
 * -------------
 * 1% = 屏幕宽度 / 100
 * 设计图纸宽度为640px
 * 1% = 640 / 100 = 6.4px
 * %与10像素的换算关系为 (10 / 6.4)%
 */
//% 系数
$vw-ratio = 10 / 6.4;

$vw1      = $vw-ratio * 0.1% //1px对应的%值

/**
 * VH (屏幕高度)
 * -------------
 * 1vh = 屏幕高度 / 100
 * 设计图纸高度为920px
 * 1vh = 920 / 100 = 9.2px
 * vh与10像素的换算关系为 (10 / 9.2)vh
 */
//vh 系数
$vh-ratio = 10 / 11.36;

$vh1      = $vh-ratio * 0.1%   //1px


/**
 * 颜色
 * ====
 * 变量命名方式
 * - 色值无规则:根据颜色，取相近的名称
 * - 色值有规则:c(表示color) + 色值简写
 */

// 主体字体
$font-family-base         = '微软雅黑';
$font-family-big          = 'Arial BoldMT';

// 主体颜色
$body-bg                  = #E2EAF0;
$pale-blue                = #86DADE;
$base-color               = #859BB8;
$red                      = #E60012;
$white-light              = #FFFEFE;
$white-gray               = #DBDFE8;
$black                    = #333333;
$black-gray               = #666666;
$deep-blue                = #2FC7AC;
$deep-bg                  = rgba(5, 18, 34, 0.4)

// 导航样色
$nav-bg                   = #0b0d12;
$nav-font-color           = #859BB8;
$nav-font-color-hover     = #86DADE;
$nav-font-size            = 16px;
$nav-info-size            = 13px;

// 地图区域样色
$map-sign-color           = #859BB8;
$map-border               = 1px solid #2E3F5F;
$map-border-dashed        = 1px dashed #2E3F5F;
$map-sign-border          = 1px solid rgba(46, 63, 95, 0.3);
$map-node-border          = 4px solid rgba(46, 63, 95, 0.3);
$map-bg                   = rgba(46, 63, 95, 0.3);
$map-bg1                  = rgba(46, 63, 95, 0.2);

// 边框样式
$border-color             = 1px  dashed  rgba(45,62,90,1)


